<template>
    <div class="route">
        <h2>导航</h2>
        <div class="route-btns">
            <a-button type="primary" @click="handleQuery"> 修改query </a-button>
        </div>
    </div>
</template>
<script setup lang="ts">
import { useRouter, useRoute } from 'vue-router'

const router = useRouter()
const route = useRoute()
router.replace({ query: { token: 213214213123 } })
const handleQuery = (e: Event) => {
    console.log(e);
    
    console.log(route)

    const randomStr = Math.floor(Math.random() * Math.pow(16, 10))
        .toString(16)
        .padStart(10, '0')
    router.replace({ query: { ...route.query, name: randomStr }, params: { id: 'second' } })
}
</script>
<style lang="scss" scoped>
.route {
}
</style>
